<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>
<link href="estbmenus.css" rel="stylesheet" type="text/css">

<script language="Javascript" type="text/javascript" src="menu-sup.js"></script>
<!-- Enlace al archivo js del objeto menú-->

<script language="JavaScript" type="text/javascript">
/*Si vas a unir varios menús usa una única función ponerMenu()*/
/*dentro de ella añades los diferentes cuerpos que generes*/
function ponerMenu(){
/*Este es el cuerpo de cada menú que generes*/
mimenu=new oMenu("mimenu","Título","capatit","capadesp","itemactivo","itemdescr","1px solid black")
mimenu.agregar("opcion1","opcion1.htm","Esta opción lleva a la página tal y cual");
mimenu.agregar("opcion 2","pagdeopc2","Pagina de la segunda opción");
/*
var Div1 = document.getElementById("$mimenu");
document.writeln("top : "+Div1.offsetTop+"  left: "+Div1.offsetLeft);*/

mimenu.dibujar(50,200);
/*fin de la función ponerMenu() y del script, colocar sólo en el último menú definido*/
}

/**/
</script>
<!---->
<script type="text/javascript" src="javascript/animatedcollapse.js">

/***********************************************
#
* Animated Collapsible DIV- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
#
* This notice MUST stay intact for legal use
#
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
#
***********************************************/

</script>



<!--
Código de un menú desplegable. Cada botón principal llama a la función Menu con sus respectivos parámetros y cambia la clase de su DIV correspondiente a NOMBREVisible o NOMBREOculto. Éstos manejan a su vez la separación con el menú superior.
Éstos datos deben ser modificados en relación a la cantidad de items que tenga cada menú.
-->
<style type="text/css">

/* Estilos de configuración del menú desplegable.*/

#dhtmlgoodies_menu ul li ul{
display:none; /* Necesario para visualizarse bien en opera */
}

#dhtmlgoodies_menu{
visibility:hidden;
}
#dhtmlgoodies_menu ul{
margin:0px; /* Sin sangria */
padding:0px; /* Sin sangria */
}
#dhtmlgoodies_menu li{
list-style-type:none; /* Sin iconos */
}
#dhtmlgoodies_menu a{
margin:0px;
padding:0px;
}

/* Estilos de la estética del menú. Aquí puedes modificarlos de acuerdo al estilo de tu web
   Estilos que se aplican a todo el menú*/

#dhtmlgoodies_menu ul{
border:1px solid #000;
background-color:#FFF;
padding:1px;
}
#dhtmlgoodies_menu ul.menuBlock1{ /* Barra de menú - elementos del menu principal*/
border:0px;
padding:1px;
border:1px solid #317082;
background-color:#E2EBED;
overflow:visible;
}
#dhtmlgoodies_menu ul.menuBlock2{ /* Barra de menú - elementos del menu principal*/
border:0px;
padding:1px;
border:1px solid #555;
}
#dhtmlgoodies_menu a{
color: #000;
text-decoration:none;
padding-left:2px;
padding-right:2px;
}

/* Estilos del menú principal. El que esta siempre visible */

#dhtmlgoodies_menu .currentDepth1{
padding-left:5px;
padding-right:5px;
border:1px solid #E2EBED;
}
#dhtmlgoodies_menu .currentDepth1over{
padding-left:5px;
padding-right:5px;
background-color:#317082;
border:1px solid #000;
}
#dhtmlgoodies_menu .currentDepth1 a{
font-weight:bold;
}
#dhtmlgoodies_menu .currentDepth1over a{
color:#FFF;
font-weight:bold;
}

/* Estilos submenu nivel 1 */

#dhtmlgoodies_menu .currentDepth2{
padding-right:2px;
border:1px solid #FFF;
}
#dhtmlgoodies_menu .currentDepth2over{
padding-right:2px;
background-color:#E2EBED;
border:1px solid #000;
}
#dhtmlgoodies_menu .currentDepth2over a{
color:#000;
} 

/* Estilos submenu nivel  2 */

#dhtmlgoodies_menu .currentDepth3{
padding-right:2px;
border:1px solid #FFF;
}
#dhtmlgoodies_menu .currentDepth3over{
padding-right:2px;
background-color:#EDE3EB;
border:1px solid #000;
}

/* Estilos submenu nivel 3 */

#dhtmlgoodies_menu .currentDepth4{
padding-right:2px;
border:1px solid #FFF;
}
#dhtmlgoodies_menu .currentDepth4over{
padding-right:2px;
background-color:#EBEDE3;
border:1px solid #000;
} 

</style>


 <script type="text/javascript">

   window.onload = initDhtmlGoodiesMenu;
  </script>


<body>

<!-- Como ejemplo crearemos un script con algunas categorias de Blogyweb.blogspot.com --> 

<div id="dhtmlgoodies_menu">
<ul>

<!-- Creamos la primer pestaña del menú: Blogger --> 

<!-- Metemos la primera opción -->
  <li><a href="http://www.dhtmlgoodies.com/search/label/Blogger/">Blogger</a>
  <ul>
<!--Ahora un submenu nivel 1 para Blogger con un par de opciones -->
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Blogger/">Nuevo Blogger </a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Blogger/">Blogger Beta </a>
  <ul>
<!-- Ponemos un submenu nivel 2 para Blogger Beta -->
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Blogger/"> Trucos</a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Blogger/"> Scripts</a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Blogger/"> Plantillas</a></li>
  </ul>
  </li>
  </ul>
  </li>

<!-- Ponemos una segunda pestaña en el menú con la opción Javascript por ejemplo--> 

  <li><a href="http://www.blogyweb.blogspot.com/search/label/Javascript/"> Trucos</a>
  <ul>
<!-- Ponemos un submenú nivel 1 para la opción trucos con 1 opción-->
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Javascript/"> Hacks</a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Javascript/"> Códigos</a>
<!-- Ponemos un submenú nivel 2 para la opción códigos -->
  <ul>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Javascript/"> Texto</a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Javascript/"> JS</a></li>
  </ul>
  </li>
  </ul>

<!-- Y por último una pestaña con la opción Photoshop con sólo una opción--> 

  <li><a href="http://www.blogyweb.blogspot.com/search/label/Photoshop/"> Tutoriales</a>
<!-- Ponemos una submenú nivel 1 para esta opcion Tutoriales-->
<ul>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Photoshop"> Imagenes</a></li>
  <li><a href="http://www.blogyweb.blogspot.com/search/label/Photoshop"> Fotografías</a></li>
  </ul>
  </li>

</ul>
</div>
<p>/*    * /</p>

<script type="text/javascript">
function remind(msg1) {
var msg = "This is a reminder after " + msg1 +" Secs";
alert(msg);
}
</script> 

<input type=radio name=rm value=5000 OnClick="mytime=setTimeout('remind(2)',2000)">After 2 Secs

      <p><b>Ejemplo 2:</b></p>

      <a href="javascript:collapse2.slideit()">Despliega/Contrae</a>

      <div id="cat" style="width: 300px; background-color: #97bf21;">

      <div style="padding: 0 5px">

      <h3>Titulo</h3>

      <p>Lorem ipsum dolorem incorrupte te mei, quo no eius docendi. Euripidis rationibus comprehensam cu has, ut sed ignota tritani, hinc habeo euripidis et mea. An porro putent mentitum vis, elit nostrum te sed, per eu cibo magna propriae. Sed cu iudico voluptaria, te usu nemore officiis partiendo.</p>

      </div>

      </div>

      <script type="text/javascript">

      var collapse2=new animatedcollapse("cat", 1000, true)
 
      </script>

<p>fd</p>
<p>&nbsp;</p>
<select name="uno" id="uno">
<option>33</option>
<option>33</option>
<option>33</option>
</select>
<p>&nbsp;</p>
<style type="text/css">
SELECT{
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(/forms/pressed.png) no-repeat scroll left top;
border:medium none;
padding:2px 8px;
	}
</style>


<!---->

<script language="Javascript" type="text/javascript">
ponerMenu();

var Div1 = document.getElementById("$mimenu");

document.writeln("top : "+Div1.offsetTop+"  left: "+Div1.offsetLeft);

</script>
</body>
</html>





